<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>疫情可视化地图</title>
    <script src="/2031echarts/js/echarts.min.js"></script>
    <script src="/2031echarts/js/china.js"></script>

</head>

<body>

    <div id="main" style="width: 600px;height:400px;"></div>
    <script type="text/javascript">

        var map = echarts.init(document.getElementById('main'));

        var data = [
            {
                name: '北京',
                value: 212
            }, {
                name: '天津',
                value: 60
            }, {
                name: '上海',
                value: 208
            }, {
                name: '重庆',
                value: 337
            }, {
                name: '河北',
                value: 126
            }, {
                name: '河南',
                value: 675
            }, {
                name: '云南',
                value: 117
            }, {
                name: '辽宁',
                value: 74
            }, {
                name: '黑龙江',
                value: 155
            }, {
                name: '湖南',
                value: 593
            }, {
                name: '安徽',
                value: 480
            }, {
                name: '山东',
                value: 270
            }, {
                name: '新疆',
                value: 29
            }, {
                name: '江苏',
                value: 308
            }, {
                name: '浙江',
                value: 829
            }, {
                name: '江西',
                value: 476
            }, {
                name: '湖北',
                value: 13522
            }, {
                name: '广西',
                value: 139
            }, {
                name: '甘肃',
                value: 55
            }, {
                name: '山西',
                value: 74
            }, {
                name: '内蒙古',
                value: 34
            }, {
                name: '陕西',
                value: 142
            }, {
                name: '吉林',
                value: 42
            }, {
                name: '福建',
                value: 179
            }, {
                name: '贵州',
                value: 56
            }, {
                name: '广东',
                value: 797
            }, {
                name: '青海',
                value: 15
            }, {
                name: '西藏',
                value: 1
            }, {
                name: '四川',
                value: 282
            }, {
                name: '宁夏',
                value: 34
            }, {
                name: '海南',
                value: 79
            }, {
                name: '台湾',
                value: 10
            }, {
                name: '香港',
                value: 15
            }, {
                name: '澳门',
                value: 9
            }
        ]

        var option = {
            visualMap:[{
                type:'piecewise'

            }],
            tooltip: {
                show: true

            },
            geo: {
                map: 'china'
            },
            series: [{
                name: '地图',
                type: 'map',
                geoIndex: 0,
                data:data

            }]

        };

        map.setOption(option);



    </script>
</body>

</html>